<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="f" %>

<div class="modal fade" id="modalRegisterForm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false" data-backdrop="false">
    <div class="modal-dialog">
        <f:form id="registerFormId" action="${pageContext.request.contextPath}/account/register" cssClass="form-horizontal modal-content"
                role="form" modelAttribute="registerUser">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">Регистрация нового пользователя</h4>
            </div>
            <div class="modal-body">
                <div class="form-group">
                    <f:label path="login" cssClass="col-md-4 control-label">Имя пользователя</f:label>
                    <div class="col-lg-6">
                        <f:errors path="login" cssClass="field-validation-error" />
                        <f:input path="login" cssClass="form-control"/>
                    </div>
                </div>
                <div class="form-group">
                    <f:label path="email" cssClass="col-md-4 control-label">Email</f:label>
                    <div class="col-lg-6">
                        <f:errors path="email" cssClass="field-validation-error" />
                        <f:input path="email" cssClass="form-control"/>
                    </div>
                </div>
                <div class="form-group">
                    <f:label cssClass="col-md-4 control-label" path="password">Пароль</f:label>
                    <div class="col-lg-6">
                        <f:errors path="password" cssClass="field-validation-error" />
                        <div class="input-group ">
                            <f:password path="password" cssClass="form-control pwd"/>
                            <span class="input-group-btn">
                                <button tabindex="-1" class="btn btn-default reveal" type="button"><i class="glyphicon glyphicon-eye-open"></i></button>
                            </span>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <f:label cssClass="col-md-4 control-label" path="confirmPassword">Подтверждение</f:label>
                    <div class="col-lg-6">
                        <f:errors path="confirmPassword" cssClass="field-validation-error" />
                        <div class="input-group ">
                            <f:password path="confirmPassword" cssClass="form-control pwd"/>
                            <span class="input-group-btn">
                                <button tabindex="-1" class="btn btn-default reveal" type="button"><i class="glyphicon glyphicon-eye-open"></i></button>
                            </span>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <f:errors path="" cssClass="col-lg-6 validation-summary-errors" />
                </div>
                <p>
                    Есть аккаунт? <a href="<c:url value="account/loginForm"/>" class="dax" data-dismiss="modal" aria-hidden="false">Вход</a>
                </p>
            </div>
            <div class="modal-footer">
                <input type="submit" class="btn btn-primary" value="Регистрация"/>
                <button type="button" class="btn btn-default" data-dismiss="modal">Отмена</button>
            </div>
        </f:form>
    </div>
</div>
<script type="text/javascript">
    $('#modalRegisterForm').modal('show');
    //$.validator.unobtrusive.parse($("#registerFormId"));

    $('#registerFormId .reveal').mousedown(function () {
        var inp = $(this).closest('.input-group').find('.pwd');
        inp.replaceWith(inp.clone().attr('type', 'text'));
    }).bind('mouseup mouseout', function () {
        var inp = $(this).closest('.input-group').find('.pwd');
        inp.replaceWith(inp.clone().attr('type', 'password'));
    });
</script>
